/* common */
.wrap{ max-width: 1400px; min-width: 500px; margin: 0 auto; position: relative; padding: 0 10px;}
.main .wrap{ padding: 0;}
 
.h_top .fr a strong,
.header ul li.on > a,
.header ul li p a.on,
.con_r dl dd a:hover,
.con_r dl dd a:hover span,
.con_r dl dd.no1 span,
.con_l ul li.open > a, .con_l ul li > a:hover,
.con_l ul li.open > p > a.on,
.bbs_re dl dd a.on{ color: #222;}
.header h1 a, 
.sub_search > div > div button,
#con1 div div.s  .b,
#con1 div div.s  .key{ font-size: 0; line-height: 0;}
.header, .header ul li p,
.sub_search > div, .sub_search,
.header .wrap ul li, .footer .f_banner img,
#con .wrap .con_r,
#con .wrap .con_l,
.q_menu ul li a span{transition:all 0.5s ease;}
.con_r dl dd a, .con_r dl dd a span,
#con2 div dl dd a strong,
#con2 div dl dd a span, #con2 div dl dd a span.d, 
#con3 div dl.m_notice dd strong{text-overflow:ellipsis; overflow:hidden; white-space:nowrap;}
.footer .f_banner *, .sub_search > div > div *,
#con .wrap .con_l *, .s_list *, .bbs_list *{ vertical-align: middle;}

html{height: 100%;}
body{height: auto;
background: -moz-linear-gradient(179deg, rgba(0,168,179,1) 10%, rgba(6,143,210,1) 50%, rgba(9,125,232,1) 100%);
background: -webkit-linear-gradient(179deg, rgba(0,168,179,1) 10%, rgba(6,143,210,1) 50%, rgba(9,125,232,1) 100%);
background: linear-gradient(179deg, rgba(0,168,179,1) 10%, rgba(6,143,210,1) 50%, rgba(9,125,232,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#00a8b3",endColorstr="#097de8",GradientType=1); 
background-attachment: fixed;
    }

/*btn*/
.btn_a{padding: 9px 25px 10px; font-size: 1em; background:#0172c2; border-radius: 50px; color: #fff; font-weight: bold;}
.btn_b{padding: 3px 10px 4px;background: #0172c2;border-radius: 50px;color: #fff;font-size: 0.8em;margin-left: 8px;}
.btn_b:hover{background:#234f7c;}

/*link*/
.link_a{ padding: 5px 0 ; color:#fff; font-weight: 600; border-bottom: 1px solid #fff; }
.link_a:hover{color:#fff004;}

/*배경 애니메이션*/
@keyframes move_wave {
    0% {
        transform: translateX(-2%) translateY(0) scale(1.3)
    }
    50% {
        transform: translateX(-3%)  translateY(-2%) scale(1.4)
    }
    100% {
        transform: translateX(-0%) scale(1.5)
    }
}
.wave{width: 100%;height: 100%;position: fixed; bottom: 0; overflow: hidden;}
.wave div{position: absolute; bottom:0; background-size: cover; width: 100%; height: 50%; }
.wave .wave1{height: 40%; background-image: url(../images/bg_wave1.png); transform: scale(1.2); animation: move_wave 15s alternate ease infinite;
   -webkit-animation: move_wave 15s alternate ease infinite;}
.wave .wave2{height: 80%; background-image: url(../images/bg_wave2.png); transform: scale(1.3) translateX(-80px); 
    animation: move_wave 10s alternate ease-in infinite;
   -webkit-animation: move_wave 10s alternate ease-in infinite;
}

/* header{ position: fixed; top: 0; left: 0; width: 100%; min-width:900px; background: rgba(0, 0, 0, 0.7) url(/images/header_bg.gif) repeat-x 0 -5px; z-index: 1000; box-shadow: 0 0 5px #555;} */


/*헤더*/
header{position: fixed; top:0; width:100%; height: 120px; z-index: 999;  transition: 0.3s;}
header .h_top{ height: 32px; overflow: hidden; text-align: center; background:#fff;}
header .h_top p{ position: absolute; top: 0; left: 0; height: 32px; overflow: hidden; font-size:0;}
header .h_top p.t_menu a{ display: inline-block; width: 180px; padding: 10px 0 10px 0; color: #7d7d7d; font-size: 0.85rem;}
header .h_top p.t_menu a.open{ background:#00a8b3; color: #fff; border-right:none;}
header .h_top p.t_menu a{ border-right: 1px solid #d3d3d3;}
header .h_top p.t_menu a:nth-child(3), header .h_top p.t_menu a:nth-child(4), header .h_top p.t_menu a:last-child{width:130px;}

header h1.logo{display: inline-block;padding: 40px 0 0 48px;}
header h1.logo span.logo_img{display: inline-block; background:url(../images/logo.png) no-repeat; background-size: contain; width: 240px; height: 51px; position: relative; font-size: 0; vertical-align: middle;}
header h1.logo span.logo_txt{font-family: TTY; display: inline-block; color:#fff; font-size: 2em; letter-spacing: 0; font-weight: 300; vertical-align: middle; margin-left: 5px;}

header nav{float: right; padding:40px 48px 0 0;}
header nav .gnb li {display: inline-block; margin-left: 30px; position: relative;}
header nav .gnb li a{color:#fff; display: block;font-size: 1.2em;  font-weight: bold; padding: 10px 25px 8px; box-sizing: border-box;}
header nav .gnb li a::before{content: ''; display: block; position: absolute; width: 8px; height: 8px; background: #fff; border-radius: 8px; top:-8px; left:50%; margin-left: -4px; transition: 0.3s;}
header nav .gnb li a:hover,
header nav .gnb li a.active{color: #fff004;}
header nav .gnb li a:hover::before,
header nav .gnb li a.active::before{background: #fff004; width: 40px; margin-left: -20px;}

.fixed{background: #fff; box-shadow: 0px 3px 5px rgba(0,0,0,0.3); padding: 0px; height:100px;}
.fixed .h_top{display: none;}
.fixed h1.logo span.logo_img{display: inline-block; background:url(../images/logo2.png) no-repeat; background-size: contain; width: 240px; height: 40px; position: relative; font-size: 0; vertical-align: middle;}
.fixed h1.logo span.logo_txt{color:#222;}

.fixed .gnb li a{color:#222;}
.fixed .gnb li a::before{background: #222;}
.fixed .gnb li a:hover,
.fixed .gnb li a.active{color:#0172c2;}
.fixed .gnb li a:hover::before,
.fixed .gnb li a.active::before{background: #0172c2;}

/*반응형 메뉴*/
header nav .gnb.on li a:hover{background:#0172c2; color:#fff;}
header nav .gnb.on li a::before {display: none;}

/*본문*/
#con{position: absolute; height: 100%; width: 100%;}

.main_left .left_wrap, .main_right .right_wrap{height: 100%;  margin-top:120px; padding: 0 88px; box-sizing: border-box;}
.main_right .right_wrap {padding-bottom: 80px; padding-right: 0;}
/*왼쪽컨텐츠*/
.main_left{width:50%; min-width: 600px; display: block; position: absolute; left: 0; color:#fff;}

/*검색창*/
.main_left .left_search h2{padding-top:64px; font-size: 2em; font-weight: 300; text-align: center; letter-spacing: -0.05em; line-height: 1.3em;}
.main_left .left_search h2 strong{font-weight: 800;}

.main_left .left_search .search_wrap{ position: relative; width:450px; margin:20px auto 32px; border:3px solid #0172c2; border-radius: 100px; padding: 5px 20px; box-sizing: border-box; background: #fff;}
.main_left .left_search label{position: absolute; text-indent: -9999px; display:none;}
.main_left .left_search select, .left_search input{border: none; padding: 10px; font-size: 1em;}
.main_left .left_search select {width:25%;padding-right: 40px; background: url(../images/arrow_select.png) no-repeat 90% 50%; display:none;}
.left_search input{width:60%;}
.main_left .left_search i.fa{font-size: 1.6em; padding: 10px; position: absolute; right: 20px; top:5px;}

#searchDonorList{min-height: 150px !important;}

/*기증신청*/
.main_left .left_num{text-align: center; border-top: 2px dotted #dfdfdf; width:80%; margin:0 auto;}
.main_left .left_num h2{padding-top:32px; font-size: 2em; font-weight: 300; text-align: center; letter-spacing: -0.05em; line-height: 1.3em;}
.main_left .left_num button{display: block; margin: 24px auto; background: #fff004; color:#0172c2}
.main_left .left_num button i{margin-right: 10px;}

/*이달의 기증자료*/
.month{margin: 40px auto 0; background-image: url(../images/bg_month_tl.png),  url(../images/bg_month_tr.png),  url(../images/bg_month_bl.png),  url(../images/bg_month_br.png);
    background-position: top left, top right, bottom left, bottom right;
  background-repeat: no-repeat; background-size: 22px 22px; padding: 5px;width:80%; min-width: 500px;}
.month_wrap{background: #f5f5f5; padding: 40px; position: relative;}
.month h2{font-size: 1em; font-weight: 300; position: absolute; padding-left: 220px; top:48px; color:#fff;margin-bottom: 16px;}
.month h2 span{padding:3px 20px 4px; background: #0172c2; border-radius: 50px;}
.month h2 strong{font-weight: 800;}
.month .month_img {width:200px; height: 200px; background: #fff; border: 1px solid #c5c5c5;}
.month .month_txt{position: absolute; padding-left: 220px; top:80px; line-height: 1.5em;}
.month .month_txt .title{display: block; font-weight: 600; font-size: 1.4em; line-height: 1.2em;}
.month .month_txt .detail{display: block; color:#7a7a7a; font-size: 0.98em; letter-spacing: -0.05em;}
.month .month_txt .detail2{display: block;}
.month .month_txt .name{line-height: 3em; color:#58585a; font-weight: 600;}

/*오른쪽 컨텐츠*/
.main_right{width:50%; height: 100%; display: block; position: absolute; right: 0; overflow: hidden;}
.main_right .slide{padding:40px 60px 24px 40px; box-sizing: border-box;  height: 88%; max-height: 800px; background: rgba(255,255,255,0.8); border-top-left-radius: 20px; border-bottom-left-radius: 20px;}

/*스크롤*/
.scroll::-webkit-scrollbar-track{border-radius: 10px;background-color: transparent;}
.scroll::-webkit-scrollbar{width: 12px;background-color: transparent;}
.scroll::-webkit-scrollbar-thumb{border-radius: 10px; background-color: rgba(0,0,0,0.0);}
.scroll:hover::-webkit-scrollbar-thumb{background-color: rgba(0,0,0,0.3);}

/*기증자리스트*/
.right_wrap #donorList{padding:0 40px;}
.donor_list{height:100%; position: relative;}
.donor_list h2{font-size: 2em; font-weight: 100; padding: 5px; text-align: center; word-break: keep-all;line-height: 1.5em;}
.donor_list h2 span{border-bottom: 1px solid #222; font-weight: 900;}

/* .donor_list .list_wrap{display: inline-block; height:calc(100% - 100px); overflow: auto; margin-top: 24px;  font-size: 0.8em; text-align: left;}
.donor_list ul li{display: inline-block; font-weight: 400; height: 30px; margin:1px 3px; transition: all 0.1s; overflow:hidden;}
.donor_list ul li a{color:#222;  padding: 2px 13px; font-size:1.1em; line-height: 30px; border-radius: 20px; box-sizing: border-box;}
.donor_list ul li:hover a{color:#fff; background: #0072c2;} */

/* 마퀴 
.donor_list .list_wrap{display: inline-block; height:calc(100% - 100px); overflow: auto; margin-top: 24px;  font-size: 0.8em; text-align: left;}
.donor_list ul li{display: inline-block; font-weight: 400; width:90px; text-align:center; height: 30px; margin:1px 3px; padding: 2px 13px; transition: all 0.3s; overflow:hidden; border-radius: 20px;  font-size:1.1em; line-height: 30px; box-sizing: border-box;}
.donor_list ul li a{color:#222; display:inline-block; width: 100%; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}
.donor_list ul li:hover{background: #0072c2;}
.donor_list ul li:hover a{color:#fff; text-overflow: inherit; overflow: visible; }
 */
/* 확대 */ 
.donor_list .list_wrap{display: inline-block; height:calc(100% - 100px); overflow: auto; margin-top: 24px;  font-size: 0.8em; text-align: left;}
.donor_list ul li{display: inline-block;font-weight: 400;width: 100px;text-align:center;height: 30px;margin: 1px 5px;transition: all 0.3s;overflow:hidden;font-size:1.1em;}
.donor_list ul li a{color:#222;display:inline-block;width: 100%;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;padding: 10px 13px;border-radius: 20px;transition: transform 0s;box-sizing: border-box;}
.donor_list ul li:hover{position:relative; overflow:visible;}
.donor_list ul li:hover a{color:#fff;text-overflow: inherit;overflow: visible;background: #0072c2;position:absolute;left:50px;transform: translateX(-50%);z-index: 100;width: 150px; padding:10px 8px; white-space: inherit; line-height:1.5em; font-weight:500;}

.marquee { margin: 0 auto;white-space: nowrap;overflow: hidden;box-sizing: border-box;}
.marquee a{animation: marquee 3s linear infinite;}
@keyframes marquee {
  0% {
    transform: translate(0, 0);
  }
  100% {
    transform: translate(-200%, 0);
  }
}

@media screen and (max-width: 1600px) {   
    .donor_list h2{font-size: 1.7em;}
}
@media screen and (max-width: 1440px) {   
    .main_right .slide{padding:40px 80px 24px 40px;}
}
@media screen and (max-width: 1300px) {
    header nav .btn_bar{display: block; position: absolute; right:40px; z-index: 100;}
    header nav .btn_bar span{width: 35px;height: 5px;background-color: #fff; margin: 6px 0;transition: 0.4s; display: block;}
    header nav .btn_bar.on span{background: #222;}
    header nav .btn_bar.on span:first-of-type{transform: rotate(-45deg) translate(-9px, 7px)}
    header nav .btn_bar.on span:nth-child(2){width:0;}
    header nav .btn_bar.on span:last-of-type{transform: rotate(45deg) translate(-9px, -6px)}
    header nav .gnb{display: block; width:300px; background: #fff; position: absolute; right: -100%; top:0; height: 100%; z-index: 50; transition: 0.5s; padding: 96px 0 0 0;}
    header nav .gnb.on{right:0; box-shadow: -5px 5px 5px rgba(0,0,0,0.3);}
    header nav .gnb li{display: block; margin: 0;}
    header nav .gnb li a{color:#222; padding: 16px 40px; border-radius: 0;}
    header nav .gnb li a:hover{color:#fff;}
    header nav .gnb li a.active{color:#0072c2;}
    .fixed .btn_bar span{width: 35px;height: 5px;background-color: #333; margin: 6px 0;transition: 0.4s; display: block;}
    .main_left, .main_right{min-width: 500px;font-size: 0.9em;}
    .main_left .left_wrap, .main_right .right_wrap{padding: 0px 0px 88px 24px; }
    .main_right .slide{padding:40px 40px 24px 40px;}
    .month{min-width: 450px;}
    .month h2{padding-left: 200px; top:48px;}
    .month .month_img {width:180px;}
    .month .month_txt{padding-left: 200px;}
    .donor_list h2{font-size:1.8em;}
}
@media screen and (max-width: 1024px) {	
    #con{overflow: inherit; position: relative; height: auto;}
    .main_left, .main_right{width:100%; max-width: inherit; position: relative; font-size: 1rem;}
    .main_right{height: 800px; overflow: hidden;}
    .main_left .left_wrap, .main_right .right_wrap{max-width: 800px; margin: 0 auto;}
    .main_left .left_wrap{ padding:80px 24px 24px;} 
    .main_right .right_wrap{padding: 0px 24px 24px 24px; }
    .main_right .slide{padding:40px 40px 24px 40px; border-radius: 20px;}
    .h_top{display: none;}
}
@media screen and (max-width: 640px) {
  header h1.logo{padding:40px 0 0 24px;}
  header h1.logo span.logo_img{width: 180px; height: 30px;}
  header h1.logo span.logo_txt{font-size: 1.5em; }  
    header nav .gnb.on{width: 100%;} 
    
    .main_left .left_num{width:90%;}
    .main_right{height: 600px;}
    .main_right .right_wrap{height: 600px;}
    .main_right .slide{height:100%;}
    
    .wrap{min-width: 400px;}
	.main_left, .main_right{min-width: 400px;}
    .month{min-width: 300px; width:95%;}
    .main_left .left_search .search_wrap{width:90%; max-width:400px;}
}

/*sub*/
.sub_left .left_wrap, .sub_right .right_wrap{height: 100%;  margin-top:132px; box-sizing: border-box;}

/*왼쪽컨텐츠*/
.sub_left{width:30%; display: block; position: fixed; left: 0;}


/*서브 검색창*/
.sub_left .left_search h2{padding-top:64px; font-size: 1.8em; font-weight: 300; text-align: center; letter-spacing: -0.05em; line-height: 1.3em; color:#fff;}
.sub_left .left_search h2 strong{font-weight: 900;}

.sub_left .left_search .search_wrap{ position: relative; width:350px; margin:20px auto 32px; border:3px solid #0172c2; border-radius: 100px; padding: 5px 20px; box-sizing: border-box; background: #fff;}
.sub_left .left_search label{position: absolute; text-indent: -9999px; display:none;}
.sub_left .left_search select, .left_search input{border: none; padding: 10px; font-size: 1em;}
.sub_left .left_search select {width:25%; background: url(../images/arrow_select.png) no-repeat 90% 50%; display:none;}
.left_search input{width:60%;background: transparent;}
.sub_left .left_search i.fa{font-size: 1.6em; padding: 10px; position: absolute; right: 20px; top:5px;}

/* 초성리스트 */
.left_order{text-align:center; width:350px; margin:0 auto;}
.left_order button{display:inline-block; width:40px; height:40px; border-radius:3px; box-sizing: border-box; border:1px solid #c5c5c5; margin:2px 0; font-size: 1.2em; font-weight:700; vertical-align: middle; background: #fff;}

.left_order button.active,
.left_order button:hover{background:#fff004; color:#0072c2;}
.left_order button.last{width:84px;}

.left_list{display:block; width:350px; border-radius:3px; background:#efefef; margin:0 auto;}
.left_list #donorList{max-height:300px; padding:24px; box-sizing: border-box; overflow:auto; font-size: 0;}
.left_list #donorList a{display: inline-block;padding: 8px 4px;border-radius: 3px;cursor:pointer;font-size: 1rem;width: 32%;height: 65px;box-sizing: border-box;vertical-align: middle;text-align: center;border: 1px solid #ddd;margin: 0.5%; overflow: hidden; background:#fff;}
.left_list #donorList a span{vertical-align: middle; display: inline-block; word-break:break-all; line-height:1.2em;}
.left_list #donorList a::before{content:''; height:100%; width:0; vertical-align: middle; display: inline-block;}
.left_list #donorList a:hover{background:#0072c2; color:#fff;}

a.line3 span{font-size:0.9em;}
a.line4 span{font-size:0.85em;position:relative;height:50px; overflow: hidden;}
a.line4 span::before, a.line4 span::after{position: absolute; background: #efefef; transition: background 0.5s;}
a.line4:hover span::before, a.line4:hover span::after{background:#0072c2;}
a.line4 span::before {content: '...';bottom:0;right: 2px;width: 1.3em;}
a.line4 span::after {content: '';width: 100%;height: 100%;}

/* 
.left_list #donorList a.width25{width:25%;}
.left_list #donorList a.width50{width:50%;}
.left_list #donorList a.width75{width:75%;}
.left_list #donorList a.width100{width:100%;}
 */
 
/* .left_list #donorList span{display: inline-block;padding: 7px 10px 8px;margin: 0 0.33px;width: 33%;height: 30px;border-radius: 50px;cursor:pointer;font-size: 1rem;text-align: center;box-sizing: border-box;vertical-align: middle;line-height: 1.2em;}
.left_list #donorList span:hover{background:#0072c2;}
.left_list #donorList span::before{content:'';width:0;display:inline-block;vertical-align:middle;}
.left_list #donorList span a{display: inline-block;vertical-align:middle;width: 100%;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;font-size: 1rem;}
.left_list #donorList span:hover a{ color:#fff;}
.left_list #donorList .marquee a{text-overflow: inherit; overflow:visible;} */

@media screen and (max-width: 1440px) {    
    .sub_left .left_search .search_wrap {max-width: 340px; width:100%; height: 56px;}
}
@media screen and (max-width: 1300px) {
    .sub_left{font-size: 0.9em;}
    .sub_left .left_wrap{padding:0 24px 0 24px;}
    .left_order, .left_list{width:100%;}
    .left_order button{width:36px; height: 36px;}
    .left_order button.last{width:75px}    
    
}
@media screen and (max-width: 1024px) {
    .sub_left{font-size: 1rem; width:100%; position: relative;}  
    .left_hide{display:none;}  
    .sub_left .left_search .search_wrap {width: 390px;}
    .left_order button{width:40px; height: 40px;}
    .left_order, .left_list{width:350px;}
    .left_order button.last{width:84px}
}

/*서브 오른쪽*/
.sub_right{width:70%; height: 100%; display: block; background-size: cover; position: absolute; right: 0;}
.sub_right .right_wrap{width: 100%; box-sizing: border-box; padding:0 80px 0 0; position:relative;}



/*기증자소개*/
.right_wrap > h4, .donor_detail_title{font-size: 2em; margin-bottom:24px; position: relative;padding: 40px 0 0 32px; z-index: 10; color:#fff; width:240px; display:inline-block;}
.right_wrap .menu_exp{color:#efefef; width:calc(100% - 280px); display:inline-block;}
.right_wrap h4.s_title{color:#222;}
.right_wrap .donor_title::before{content: '\f007';font-family: FontAwesome;font-style: normal;font-weight: normal;text-decoration: inherit; color:#fff; opacity:0.5; font-size: 2.5em; margin-right: -16px; position: absolute; top:0; left:0; z-index: -1;}
.donor_item{width:calc(25% - 16px); margin-bottom:16px; background: #fff; border-radius: 5px; box-sizing: border-box; box-shadow: 3px 3px 5px rgba(0,0,0,0.5); overflow: hidden; font-size: 1.2em;}
.donor_item a{display: block; padding: 0 0 24px;}
.item-sizer{width:calc(33.333% - 16px);}
.donor_item .img{display: block;position:relative;padding:0;width:100%;height: 240px;background-repeat: no-repeat;background-size: contain;background-position: 50% 50%;background-color: #efefef;overflow: hidden;text-align: center;}

.donor_item .img::before{content: '';height: 100%;width: 0px;vertical-align: middle;display: inline-block;}
.donor_item .img img{transition:0.3s;max-width:100%;max-height:100%;display: inline-block;vertical-align: middle;}
.donor_item:hover .img img{transform:scale(1.1);}
.donor_item h5{padding: 24px 24px 8px 24px; font-size: 1.5em; color:#222; letter-spacing: 0; font-weight: 600;}
.donor_item span{padding: 0 24px; display: block; line-height: 1.4em;}
.donor_item span.detail{margin-top: 8px;color:#222;}

@media screen and (max-width: 1600px) {   
    
    .donor_item{width:calc(33.333% - 16px);}
}

@media screen and (max-width: 1300px) {    
    .sub_right{font-size: 0.9em;}    
    .donor_item{width:calc(50% - 16px); max-width: inherit;}
}
@media screen and (max-width: 1024px) {
    .sub_right{font-size: 1rem; width: 100%; height: auto; position: relative; }
    .sub_right .right_wrap{padding:0 24px;height: auto;}     
  .sub_right:before, .sub_right:after {display: table;content: "";clear:both;} 
  
}
@media screen and (max-width: 768px) {    
    .sub_right{font-size: 1rem; width: 100%; height: auto;}    
    .donor_item{width:100%;  max-width: inherit;}
    .right_wrap .menu_exp{width:100%;padding:0px 24px 24px; box-sizing: border-box;}
}


/*검색결과*/
h4.search_title{text-align: center; font-weight: 300; color:#fff; margin-bottom:26px; font-size:1.8em;}
h4.search_title .keyword{font-weight: 800;}
.result_num{width: 120px; margin: 0 auto; background: #0172c2; padding: 16px 24px; text-align: center; color: #fff; border-radius: 50px; font-size: 1.4em; font-weight: 600; margin-bottom: 40px;}
.donor_search{margin: 0 auto; width: 90%; max-width: 1132px}
.donor_search::after{content: ''; display: block; clear: both;}
.donor_search_item{width:calc(50% - 16px); max-width: 550px; height:180px; margin-bottom:16px; margin-right: 16px; background: #fff; border-radius: 5px; box-sizing: border-box; box-shadow: 3px 3px 5px rgba(0,0,0,0.5); overflow: hidden; font-size: 1.2em; float: left;  padding: 24px;}
.donor_search_item a{display: block;}
.donor_search_item .img{float: left; width:160px; height: 120px; background-repeat: no-repeat; background-size: contain; background-position: 50% 50%; background-color: #efefef; margin-right: 16px; text-align: center;}
.donor_search_item .img::before{content: '';height: 100%;width: 0px;vertical-align: middle;display: inline-block;}
.donor_search_item .img img{max-width:100%; max-height:100%; vertical-align: middle; display: inline-block;}
.donor_search_item h5{font-size: 1.5em; color:#222; letter-spacing: 0; font-weight: 600; margin-bottom: 16px;}
.donor_search_item span{line-height: 1.4em;}
.donor_search_item span.detail{margin-top: 8px; color:#222; display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;text-overflow: ellipsis;}

@media screen and (max-width: 1440px) {    
    .donor_search{width: 100%; padding-left: 16px;}
}
@media screen and (max-width: 1300px) {    
    .donor_search_item .img{width: 150px;}
}
@media screen and (max-width: 768px) { 
    .donor_search{width: 100%; padding-left: 0;}
    .donor_search_item {width: 100%; margin-right: 0; max-width: inherit;}

}

/*검색결과:페이지*/
.pager{text-align: center; clear: both;}
.pager>a{display: inline-block;line-height: 1.4em; padding: 10px; margin:0; vertical-align: middle; color:#fff}
.pager a i{font-size: 1.5em; color:#fff;}
.pager .page_num{display: inline-block; padding-left: 0;margin: 20px 20px; vertical-align: middle;}
.pager .page_num > li {display: inline;}
.pager .page_num > li > a{position: relative;float: left;padding: 10px 16px;line-height: 1.4em;text-decoration: none;color: #fff; margin-left: -1px;}
.pager .page_num > li > a:hover,
.pager .page_num > li > a:focus{color: #222;background-color: #eeeeee;border-color: #dddddd;}
.pager .page_num > .active > a,
.pager .page_num > .active > a:hover,
.pager .page_num > .active > a:focus{z-index: 2; color: #222; background-color: #fff004;}



/*기증자상세*/
/*기증자 소개*/
.donor_intro::after{content: ''; clear: both; display: block;}
.donor_intro .donor_name{float: left; width:100%; display: inline-block; border-radius: 5px; box-sizing: border-box; min-height: 124px; padding: 24px; box-sizing: border-box; color:#fff;}
.donor_intro .donor_name .donor_detail_title{position: relative; padding: 8px 0 8px 81px; margin: 0; display: inline-block; width:auto;}
.donor_intro .donor_name .donor_detail_title::before{content: '\f007';font-family: FontAwesome;font-style: normal;font-weight: normal;text-decoration: inherit; color:#555; font-size: 1.5em; position: absolute; top:0px; left:0px; z-index: -1; background: #fff; padding: 13px 20px; height: 72px; width: 72px; border-radius: 50px; box-sizing: border-box;}
.donor_intro .donor_name .donation_num{display: block; padding-left: 86px; font-size: 1.2em;}

.donor_intro .donor_comment{float: right; width:100%; margin-left: 16px; display: inline-block; background: rgba(255,255,255,0.8); border-radius: 5px; box-sizing: border-box; min-height: 80px; padding: 24px; font-size: 1.2em; line-height: 1.5em; position: relative;}
.donor_intro .donor_comment::before{content: '';position: absolute;left: 60px;top: -10px;margin-left: -10px;width: 0;height: 0;border-left: 10px solid transparent;border-right: 10px solid transparent;border-bottom: 10px solid rgba(255,255,255,0.8);}

.donor_intro .menu_exp{width:100%; text-align: right; margin-top:8px;}


/*기증품 설명*/
.donor_detail{ background: #fff; border-radius: 5px; box-sizing: border-box; min-height: 124px; padding: 40px; box-sizing: border-box; box-shadow: 3px 3px 5px rgba(0,0,0,0.5); margin-top: 16px; margin-bottom:40px;}
.donor_recent{margin-bottom: 24px;background: #333;color: #fff;padding: 8px 24px 10px;border-radius: 3px; line-height: 1.5em;}
/*상세01:기증품소개*/
/*이미지*/
.img_wrap{position: relative;width:50%; max-width:528px; height: 564px; background: #efefef; border-radius: 5px; text-align: center; box-sizing: border-box; float: left;}
.img_wrap .btn_imgprev{position: absolute; left:0px; top:50%; margin-top:-40px; z-index:100; opacity:0.1;}
.img_wrap:hover .btn_imgprev{opacity:1;}
.img_wrap .btn_imgnext{position: absolute; right:0px; top:50%; margin-top:-40px; z-index:100; opacity:0.1;}
.img_wrap:hover .btn_imgnext{opacity:1;} 
.img_wrap .btn_big{position: absolute; width: 56px; height: 56px; right: 24px;top:30px;font-size: 1.5em; background: #58585a; border-radius: 50px; color:#fff; z-index: 100;}
.img_wrap span{width: 100%; height:calc(100% - 90px); overflow: hidden; display: block;}
.img_wrap span::before{content: ''; height: 100%; width: 0px; display: inline-block; vertical-align: middle;}
.img_wrap img{display:inline-block; vertical-align: middle; max-width:calc(100% - 30px); max-height: 100%;}   
.img_wrap .btn_imgprev img, .img_wrap .btn_imgnext img {max-width:100%;}

.img_wrap .txt_box{position: absolute; width: 95%; min-height:70px; right: -100%; bottom:0px; font-size: 1.2em; text-align-last: left; padding: 20px; box-sizing: border-box; border: 5px solid #0172c2; border-radius: 8px; line-height: 1.3em;}
.img_wrap .txt_box::before{content: ''; position: absolute; left: -23px; top:25px; margin-top: -10px;width: 0;height: 0;border-top: 18px solid transparent;border-right: 23px solid #0172c2;border-bottom: 18px solid transparent;}
.img_wrap .txt_box::after{content: ''; position: absolute; left: -15px; top:33px; margin-top: -10px;width: 0;height: 0;border-top: 10px solid transparent;border-right: 15px solid #fff;border-bottom: 10px solid transparent;}
 
  @media screen and (max-width: 560px) {
  .img_wrap .btn_big {top:40px;right:10px;}      
}
 

/*기증자료관추가*/
.mj_thum {position: absolute;bottom:15px;left:0;right:0;text-align:center;width:100%;}  
.mj_thum button, .mj_thum ul {display: inline-block;vertical-align: middle;}
.mj_thum ul {overflow: hidden;} 
.mj_thum ul li {display: table;float:left;margin:0 2px;}    
.mj_thum ul li a {display: table-cell;border:2px solid #ddd;vertical-align: middle;width:55px;height:55px;overflow: hidden;background-color:#fff;}  
.mj_thum ul li a:hover {border-color:#777;} 
.mj_thum ul li.active a {border:2px solid #0981e4;} 
.mj_thum ul li img {width:100%;height:100%;max-width: 100%;}   
.mj_thum button {width:25px;height:25px;border-radius: 50%;background-color:#000;opacity: 0.4;} 
.mj_thum button:hover {opacity: 0.7;} 
.mj_thum button .fa {font-size:20px;color:#fff;line-height: 23px; }
.mj_thum button .txt {font-size:0;}  

@media screen and (max-width: 1300px) { 
  .mj_thum ul li a {width:35px;height:35px;} 
  .mj_thum button {margin-top:-2px;} 
}
 @media screen and (max-width:1024px) {  
   .mj_thum {top: auto;bottom: auto;background: #f1f1f1; 
    padding: 0 0 15px;position: relative;}  
}
@media screen and (max-width:460px) {   
  .mj_thum ul li a {width:25px;height:25px;} 
}

/* 대 吏  ㅻ챸*/
.intro_txt{display: inline-block; width:calc(45% - 40px); margin-left: 40px;}
.intro_txt .intro_tab{display: block; margin-bottom:16px;}
.intro_txt .intro_tab li{display: inline-block; font-size:1.2em; padding:5px 0;}
.intro_txt .intro_tab li::before{content: '쨌'; margin:0 16px;}
.intro_txt .intro_tab li:first-child::before{content: none;}
.intro_txt .intro_tab li span.active{color:#0172c2; background:#eee; font-weight: bold; padding:0 4px;}
.intro_txt h4{ display: inline-block; background: #0172c2; color: #fff; padding: 8px 24px; border-radius: 50px; font-size: 1.2em; font-weight: 600; margin-bottom: 0}
.intro_txt .item_name{margin-top: 8px;}
.intro_txt .item_name span{display: block; color:#666; line-height: 1.5em; font-weight: 300; margin-left: 8px; font-size: 1.2em; letter-spacing: -0.02em;}
.intro_txt .item_name .title{font-size: 1.3em; color: #222; font-weight: 600;}

/*상세02:기증품소개2*/
.contents_wrap{margin-bottom: 24px;}
.contents_wrap h4.s_title{font-size: 1.2em; margin-bottom: 16px; clear: both; padding-top: 40px; padding-left: 0;}
.contents_wrap .exp{line-height: 1.8em; font-size: 1.2em; color:#595c5e; padding-bottom: 24px; margin-bottom: 40px; border-bottom: 1px solid #595c5e;}

/*상세03:기증품소개3*/
.img_list{position: relative; max-width: 100%; text-align: justify;}
.img_list::after{content: ''; display: block; clear: both;}

.img_list > p{float: left; width: 14%; margin-right: 0.2%; margin-top:10px; height: 100px;  border: 1px solid #e0e5e8; box-sizing: border-box;}
.img_list > p a{display: block; position: relative; height: 100px; text-align: center;}
.img_list > p.active{margin-bottom: 10px;border: 1px solid #0172c2; position: relative;}
.img_list > p.active::after{content: ''; position: absolute; left:0; top:0; height:100%; width:100%; border:3px solid #0172c2; box-sizing: border-box;}
.img_list > p.active a::before{content: '';position: absolute;left: 50%;bottom:-10px;margin-left: -10px;width: 0;height: 0;border-left: 10px solid transparent;border-right: 10px solid transparent;border-bottom: 10px solid #999;}
.img_list > p.active a::after{content: '';position: absolute;z-index: 100;left: 50%;bottom: -11px;margin-left: -10px;width: 0;height: 0;border-left: 10px solid transparent;border-right: 10px solid transparent;border-bottom: 10px solid #efefef;}
.img_list > p a img{max-width: 100%; max-height: 98%;}
.img_list > p a .imgYear{display:block; position:absolute; bottom:2px; width:100%; height:2em; line-height:2em; font-size:0.9em; color:#fff; background:rgba(0,0,0,0.7); overflow:hidden;}

.img_detail{position: relative; width:99%; background: #efefef; min-height: 520px; box-sizing: border-box; padding: 40px; text-align: center; clear: both; border:1px solid #999;}
.img_detail .img_item_img{height:340px; line-height: 340px;}
.img_detail img{max-height: 340px; max-width:100%; margin-bottom: 16px; vertical-align: middle;}
.img_detail .img_item_name{text-align: left; font-size: 1.2em; color:#666; font-weight: 300; line-height: 1.3em;}
.img_detail span{display: block;}
.img_detail .img_item_name .title{color:#222; font-weight: 500;}
.img_detail .img_item_name .eng{font-size: 0.8em;}
 .img_list li.active .img_detail{display: block;}
.img_detail .btn_big{position: absolute; width: 56px; height: 56px; right: 24px; top:24px; font-size: 1.5em; background: #58585a; border-radius: 50px; color:#fff; z-index: 100;}

/*상세04:구술영상*/
.donor_media h3, .donation_list h3{font-size: 1.3em; border-bottom: 1px solid; padding: 32px 0 8px; margin-bottom: 16px;}
/*소개*/
.donor_info{font-size: 1.2em;}
.donor_info dt{width: 11%; display: inline-block;line-height: 2em; color:#666; font-size: 0.9em;}
.donor_info dd{width: 80%; display: inline-block;}

/*상세05:동영상리스트*/
.media_wrap{margin-top: 20px; position: relative;}
.media_wrap::after{content: ''; display: block; clear: both;}
.media_wrap p{float:left; width:24%; height: 200px; position: relative; margin-right: 1%; margin-bottom: 10px;}
.media_wrap p.active::after{content: ''; position: absolute; left: 50%; bottom:-10px; margin-left: -10px;width: 0;height: 0;border-left: 10px solid transparent; border-right: 10px solid transparent; border-bottom: 10px solid #efefef;}
.media_wrap p a{position: absolute; display: block; width: 100%; height: 100%; overflow: hidden;}
.media_wrap p a .thumb{width:100%; height: 100%; background-size: cover; position: absolute; top:0; left: 0; transition: all 0.3s;}
.media_wrap p a:hover .thumb{transform: scale(1.1);}
.media_wrap p a .txt{position: absolute; bottom:0; left: 0; background: #efefef; padding: 10px; font-size: 1.2em; line-height: 1.2em; width:100%; box-sizing:border-box;}

/*동영상*/
.media_view{width: 99%; background: #efefef; padding: 20px; box-sizing: border-box; position: relative; clear: both; margin-bottom: 16px;}
.media_view iframe{width:575px;height: 326px; margin: 0 auto 16px;display: block;}
.media_view h5.media_title{border-bottom: 1px solid #ddd; font-size: 1.2em; padding-bottom: 8px;}
.media_view dl dt,.media_view dl dd{display: inline-block; font-size: 1.1em;margin-top: 16px; color:#555;}
.media_view dl dt {width: 15%;}
.media_view dl dd {width: 80%;}
.media_view iframe{overflow:hidden; border:none;}


/*상세06:기증품목록*/
h4.list_title{background: #222; display: inline-block; color: #fff; padding: 10px 30px; font-size: 1.2em; margin-bottom: 0;}
.table_list{width: 100%; border-top: 2px solid #222; border-bottom: 2px solid #222;}
.table_list td, .table_list th{padding: 20px; text-align: center;}
.table_list th{background: #efefef;}
.table_list td{ font-size: 1.2em; color:#666; border-top: 1px solid #dadada;}
.table_list td:nth-of-type(2){text-align: left;}

/*기증품목록:페이지*/
.table_pager{text-align: center; clear: both;}
.table_pager>a{display: inline-block;line-height: 1.4em; padding: 10px; margin:0; vertical-align: middle; color:#666}
.table_pager a i{font-size: 1.5em;}
.table_pager .page_num{display: inline-block; padding-left: 0;margin: 20px 20px; vertical-align: middle;}
.table_pager .page_num > li {display: inline;}
.table_pager .page_num > li > a{position: relative;float: left;padding: 10px 16px;line-height: 1.4em;text-decoration: none;color: #222; margin-left: -1px;}
.table_pager .page_num > li > a:hover,
.table_pager .page_num > li > a:focus{color: #222;background-color: #eeeeee;border-color: #dddddd;}
.table_pager .page_num > .active > a,
.table_pager .page_num > .active > a:hover,
.table_pager .page_num > .active > a:focus{z-index: 2; color: #ffffff; background-color: #234f7c;}

/*최근기증자*/

.right_wrap h4.recent_donor_title::before{content: '\f0c0';font-family: FontAwesome;font-style: normal;font-weight: normal;text-decoration: inherit; color:#fff; opacity:0.5; font-size: 2em; margin-right: -16px; position: absolute; top:0; left:0; z-index: -1;}

.recentSearch{display: block; position:absolute; width:40px; height:40px; top:38px; left:170px; background:#fff; z-index:100; border-radius: 50px; line-height: 38px; text-align: center; box-sizing: border-box;overflow: hidden; transition:all 0.3s;}
.recentSearch.on{width:280px;}
.recentSearch i{font-size:1.6em;}
.searchOff{box-sizing: border-box; display:block;}
.on .searchOff{display: none;}
.searchOpen{width:0px; display:none; overflow:hidden;}
.on .searchOpen{width:280px; display:block;}
.searchOpen label{display: inline-block; width:0; height:0; text-indent: -9999px; overflow: hidden;}
.searchOpen input{width:180px; border:none;}


.recent_item{position: relative; width:calc(25% - 16px); display: inline-block; margin-left: 16px; height: 440px; margin-bottom:16px; background: #fff; border-radius: 5px; box-sizing: border-box; box-shadow: 3px 3px 5px rgba(0,0,0,0.5); overflow: hidden; font-size: 1.2em;}
.recent_item .img{display: block; width:100%; height: 240px; background-repeat: no-repeat; background-size: 100%;; background-position: center center; background-color: #efefef; box-sizing: border-box; transition: all 0.5s;}
.recent_item:hover .img{background-size: 120%;}
.recent_item h5{padding: 24px 24px 8px 24px; font-size: 1.5em; color:#222; letter-spacing: 0; font-weight: 600;}
.recent_item span{padding: 0 24px; display: block; line-height: 1.4em;}
.recent_item span.detail{height: 1.6em; width:90%; margin-top: 8px; padding-bottom: 24px; color:#222; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 2;display: -webkit-box;-webkit-box-orient: vertical;word-wrap:normal;}
.recent_item .btn_big{position: absolute; width: 48px; height: 48px; right: 8px; top:8px; font-size: 1.2em; background: #58585a; border-radius: 50px; color:#fff; z-index: 100;}



@media screen and (max-width: 1600px) {  
    .recent_item{width: calc(33.333% - 16px);}
}

@media screen and (max-width: 1300px) {  
    .recent_item{width: calc(50% - 32px); max-width: inherit;}
    .pager{font-size:0.8em;}
    .pager .page_num > li > a{padding:8px 14px;}
}

@media screen and (max-width: 1024px) {    
   .img_wrap{width:100%;height:auto;; float: inherit; background: none;max-width: 100%;}  
    .img_wrap .txt_box{right:0; width:100%; position:relative; word-break: break-all; margin-top:24px;}
    .img_wrap .txt_box::before{left: 25px;top: -41px;margin-top: 0;border-right: 18px solid transparent;border-bottom: 23px solid #0172c2;border-left: 18px solid transparent;}
  .img_wrap .txt_box::after{left: 33px;top: -25px;margin-top: 0;border-left: 10px solid transparent;border-bottom: 15px solid #fff;border-right: 10px solid transparent;}
    .img_wrap span {width: 100%;height: auto;overflow: hidden;display: block;background: #efefef; position: relative;padding:20px 0;}
  .img_wrap span::before {display: none;}  
  
}
@media screen and (max-width: 768px) {   
    .recent_item{width: 100%; max-width: inherit; margin-left:0;}
    
    .donor_detail{padding:24px;}
    
    .img_list > p{height: 60px;}
  .img_list > p a{height: 60px;}    
    
    .intro_txt{width:100%;margin-left: 0; margin-top:16px;} 
    .table_list{font-size:0.9em;}
    .table_list td, .table_list th{padding: 10px;}
    .table_list colgroup col{width:auto !important}
    
    .donor_intro .menu_exp{padding:0;}
    .pager .page_num{margin:10px 10px;}
    .pager .page_num > li > a{padding:5px 9px;}
        
  .table_pager>a{padding: 6px;} 
  .table_pager .page_num{margin: 10px 10px;}  
  .table_pager .page_num > li > a{padding: 4px 8px;}    
    
}
@keyframes chart_ani1{
    0%{
        width:0%;
    }
    100%{
      
    }
}
@keyframes chart_ani2{
    0%{
        height:0%;
    }
    100%{
      
    }
}
/*기증통계*/
.right_wrap h4.static_title::before{content: '\f080';font-family: FontAwesome;font-style: normal;font-weight: normal;text-decoration: inherit; color:#fff; opacity:0.5; font-size: 2em; margin-right: -16px; position: absolute; top:8px; left:0; z-index: -1;}
.static_year{display: inline-block; font-size: 0.6em;}
.static{height:700px; position:relative;}
.static P img{width: 100%;}
.static ul {display: block; width: 100%; font-size: 1em; font-size:0;}

.static li{display: inline-block; margin-bottom: 8px; width:33%; text-align: center; font-size:1rem;}
.static li a{position: relative;  display: block; font-size: 1.2em; padding: 16px ;color:#222; font-weight: 600; border:1px solid #ddd; border-left:none; background:#efefef;}
.static li:first-child a{ border-top-left-radius: 50px; border-bottom-left-radius: 50px; border-left:1px solid #ddd;}
.static li:last-child a{ border-top-right-radius: 50px; border-bottom-right-radius: 50px;}
.static li.active{}
.static li.active a{background:#0773bc; color:#fff; border:1px solid #0773bc;}
.static li > div{display: none; position:absolute; width:100%; left:0px; padding:40px; box-sizing: border-box;}
.static li.active > div{display: block;}

.chart{width:100%; position: relative; z-index: 10;}
.chart>div{margin-bottom: 24px;}

/*기증연도별*/
.chart_a::before{content: '\f073';font-family: FontAwesome;font-style: normal;font-weight: normal;text-decoration: inherit; color:#eee; position: absolute; right:0; bottom:0; font-size: 200px; z-index: -1;}
.chart_a span{display:inline-block; font-size:1.2em;}
.chart_a .year{font-weight: 600; width:12%;}
.chart_a .per{width:calc(85% - 16px); background: #efefef; margin:0 8px; text-align: left;}
.chart_a .per em{width: 0%; display: inline-block; background: #0773bc; text-align: right; padding:4px 16px 6px; color:#fff; font-style: normal; line-height: 3em;}
.chart_a .num{width:15%;}
.chart_a >div:first-of-type .per em{width:9.6%; animation: chart_ani1 2s 0.1s;}
.chart_a >div:nth-of-type(2) .per em{width:26.2%; animation: chart_ani1 2s 0.2s;}
.chart_a >div:nth-of-type(3) .per em{width:10.4%; animation: chart_ani1 2s 0.3s;}
.chart_a >div:nth-of-type(4) .per em{width:9.4%; animation: chart_ani1 2s 0.4s;}
.chart_a >div:nth-of-type(5) .per em{width:74.6%; animation: chart_ani1 2s 0.5s;}
.chart_a >div:nth-of-type(6) .per em{width:74%; animation: chart_ani1 2s 0.6s;}
.chart_a >div:nth-of-type(7) .per em{width:1.6%; text-align: left; padding-right: 40px; animation: chart_ani1 2s 0.7s;}

/*시기별*/
.chart_b{font-size: 0;}
.chart_b::before{content: '\f1da';font-family: FontAwesome;font-style: normal;font-weight: normal;text-decoration: inherit; color:#eee; position: absolute; top:0px; font-size: 300px; z-index: -1;}
.chart_b>div{display: inline-block; width: 10%;box-sizing: border-box; font-size: 1rem; height: 500px;  vertical-align: bottom; position: relative; margin: 0; text-align: center;}
.chart_b>div span{display: block;}
.chart_b>div .per {border-left: 1px solid #ddd; padding:0 16px; height: 100%; position: relative; box-sizing: border-box;}
.chart_b>div .per em{background: #27a2b8; width:calc(100% - 32px); display: block; position: absolute; bottom: 0; font-weight: 900; color: #27a2b8; }
.chart_b>div .per em span{position: absolute; top:-24px;font-style: normal; width: 100%; }
.chart_b>div .name{border-top: 1px solid #ddd; padding-top: 8px; font-weight: 600;}
.chart_b>div:first-of-type .per em{height: 6.2%; animation: chart_ani2 2s 0.1s;}
.chart_b>div:nth-of-type(2) .per em{height: 6.4%;animation: chart_ani2 2s 0.2s;}
.chart_b>div:nth-of-type(3) .per em{height: 7.4%;animation: chart_ani2 2s 0.3s;}
.chart_b>div:nth-of-type(4) .per em{height: 27.2%;animation: chart_ani2 2s 0.4s;}
.chart_b>div:nth-of-type(5) .per em{height: 46.8%;animation: chart_ani2 2s 0.5s;}
.chart_b>div:nth-of-type(6) .per em{height: 63.2%;animation: chart_ani2 2s 0.6s;}
.chart_b>div:nth-of-type(7) .per em{height: 28.8%;animation: chart_ani2 2s 0.7s;}
.chart_b>div:nth-of-type(8) .per em{height: 28%;animation: chart_ani2 2s 0.8s;}
.chart_b>div:nth-of-type(9) .per em{height: 29.6%;animation: chart_ani2 2s 0.9s;}
.chart_b>div:nth-of-type(10) .per em{height: 16.4%; background: #999;;animation: chart_ani2 2s 1s; color:#555}

/*유형별*/
.intro_wrap ul .chart_c ul{width: 100%; font-size:1em;}
.intro_wrap ul .chart_c li{float: left; width: 25%; margin-bottom: 24px; font-size:1.2em; line-height: 1.2em;}
.intro_wrap ul .chart_c li::before{content: none;}
.intro_wrap ul .chart_c li span{display: block; text-align: center;}
.intro_wrap ul .chart_c li .icon{width:90px; height: 90px; background-repeat: no-repeat; margin: 0 auto;}
.ico01{background-image: url(../images/ico_chart07.png);}
.ico02{background-image: url(../images/ico_chart01.png);}
.ico03{background-image: url(../images/ico_chart06.png);}
.ico04{background-image: url(../images/ico_chart04.png);}
.ico05{background-image: url(../images/ico_chart08.png);}
.ico06{background-image: url(../images/ico_chart03.png);}
.ico07{background-image: url(../images/ico_chart12.png);}
.ico08{background-image: url(../images/ico_chart02.png);}
.ico09{background-image: url(../images/ico_chart11.png);}
.ico10{background-image: url(../images/ico_chart10.png);}
.ico11{background-image: url(../images/ico_chart05.png);}
.ico12{background-image: url(../images/ico_chart09.png);}
.intro_wrap ul .chart_c li .name{font-size: 0.8em;}
.intro_wrap ul .chart_c li .num{color:#0773bc; font-weight: 900; font-size: 1.2em;}

@media screen and (max-width: 1300px) {     
    .intro_wrap ul .chart_c li{width: 33.333%;}
}
@media screen and (max-width: 1024px) { 
    .chart{width:100%; clear: both; font-size:0.9em;}
    .chart_a::before{top:90%;} 
    .chart_b::before{left:0;}
    .chart_b>div{width:9%;}
}
@media screen and (max-width: 640px) { 
  .static li > div{padding:24px;}
    .chart{font-size:1em;}
    
    .chart_b>div .per{padding:0 8px;}    
    .chart_b>div .per em{width: calc(100% - 16px);}
    
    .chart_a .year{width:20%;}
    .chart_a .per{width:calc(80% - 16px);}
    .chart_a .num{width:0;}
    .chart_b>div .name{font-weight: 300;}
    .chart_b>div{width:18%; margin-top:50px; height:200px;}
    .chart_b>div:nth-of-type(5n) .per{border-right: 1px solid #ddd;}
    .intro_wrap ul .chart_c li{margin-bottom:16px;}

}
/*기증관소개*/
.right_wrap h4.intro_title::before{content: '\f19c';font-family: FontAwesome;font-style: normal;font-weight: normal;text-decoration: inherit; color:#fff; opacity:0.5; font-size: 2em; margin-right: -16px; position: absolute; top:8px; left:0; z-index: -1;}
.intro_wrap{background: #fff; border-radius: 5px; box-sizing: border-box; min-height: 124px; padding: 40px; box-sizing: border-box; box-shadow: 3px 3px 5px rgba(0,0,0,0.5); margin-top: 16px; margin-bottom: 40px;}

.intro_wrap article{margin:0 0 40px;}
.intro_wrap article::after{content: ''; display: block; clear: both;}
.intro_wrap article h5{float: left; width: 184px; font-size: 1.2em;line-height: 1.5em;}
.intro_wrap article p, .intro_wrap article ul, .intro_wrap article ol{width: calc(100% - 184px); float: right; font-size: 1.15em; line-height: 1.5em; color:#555;}
.intro_wrap article p.bold{font-size:1.6em; padding-bottom:16px; font-weight: 500; color:#222;}
.intro_wrap article p.bold span{border-bottom:1px solid #0172c2;}
/* .intro_wrap article p.bold::after{content: ''; display:block; height: 2px; width: 20px; background:#0172c2;} */
.intro_wrap article ul.none li::before{content: none;}

/*자료집 전시회*/
.intro_wrap article.inbox{width: 100%; background: #efefef; border-radius: 5px; padding:32px; box-sizing: border-box;}
.intro_wrap article.inbox h5{width: 100%; margin-bottom: 16px;}
.intro_wrap article .exhiWrap{display: inline-block; width: calc(100% - 200px);vertical-align: top;}
.intro_wrap article .exhi {display: inline-block; width: calc(50% - 4px); vertical-align: top; margin-bottom:16px;}
.intro_wrap article .exhi img{float:left;}
.intro_wrap article .exhi .inbox_txt{float:left; margin-left:16px;}
.intro_wrap article .exhi .inbox_txt span{display:block; margin-bottom:16px;}
.intro_wrap article .exhi .inbox_txt span.title{font-size: 1.3em; color:#222;}
.intro_wrap article .exhi .inbox_txt span.sm{font-size: 0.9em;}
.intro_wrap article .exhi .inbox_txt span.btn_go{padding:4px 16px; background:#0172c2; color:#fff; display:inline-block; border-radius:2px;}
.intro_wrap article .exhi .inbox_txt span.sm2{font-size:0.9em;}

.intro_wrap article ol{background: #efefef; border-radius: 5px; box-sizing: border-box; padding: 16px; position: relative;}
.intro_wrap article ol li::before{content: ''; display: block; width:100%; height: 1px; background-color: #bbb; position: absolute;top:105px; z-index: -1;}
.intro_wrap article ol li{width: 25%; float: left; text-align: center; background-repeat: no-repeat; padding: 88px 0 0 0; background-position: center top; position: relative; z-index: 10;}
.intro_wrap article ol li .num{display: block; width: 32px;  height: 32px; border-radius: 50px; background: #ed1a3b; line-height: 30px; color:#fff;margin: 0 auto; font-size: 1em; font-weight: bold;}
.intro_wrap article ol li strong{display: block; margin-top: 8px;}
.intro_wrap article ol li span{font-size: 0.85em;}
.intro_wrap article ol li:first-child{background-image: url(../images/icon_intro01.png);}
.intro_wrap article ol li:nth-child(2){background-image: url(../images/icon_intro02.png);}
.intro_wrap article ol li:nth-child(3){background-image: url(../images/icon_intro03.png);}
.intro_wrap article ol li:nth-child(4){background-image: url(../images/icon_intro04.png);}

.intro_wrap article ul li{margin-bottom: 8px;}
.intro_wrap article ul li::before{content: ''; display: inline-block; width:6px; height: 2px; background: #888; vertical-align: middle; margin-right: 8px;}


@media screen and (max-width: 1440px) {       
  .intro_wrap article .exhiWrap{width:100%;}
    .intro_wrap article .exhi{display: inline-block;  width: 100%; margin-bottom: 8px; padding-left: 200px;}    
}
@media screen and (max-width: 1300px) {   
    .intro_wrap article h5{float: none; margin-bottom: 8px;}
    .intro_wrap article p, .intro_wrap article ul, .intro_wrap article ol{width: 100%;;}
    .intro_wrap article .exhi{width: 100%; margin-bottom: 8px; padding-left: 0;}
    .intro_wrap article .exhi .inbox_txt{width:calc(100% - 200px); float:left;}
}
@media screen and (max-width: 1024px) { 
    .intro_wrap{padding:24px;}
}

@media screen and (max-width: 768px) { 
    .intro_wrap article ol li{width: 50%; margin-top: 16px; height: 160px;}
}


/*확대이미지 레이어팝업*/
.img_layer{position: fixed; top:0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.9); z-index: 9999;}
.img_layer .img_pop_wrap>p{position: absolute; top:50%; left:50%; transform: translate(-50%, -50%);}
.img_layer .img_pop_wrap_a{position: absolute; top:50%; left:50%; transform: translate(-50%, -50%);}
.img_layer .img_pop_wrap img{max-width:100%; max-height:100%;}
.img_layer .img_close{position: absolute; font-size: 4em; color:#fff; top:40px; right:40px;}
.img_layer .txt{width:100%; color:#222; font-size:1.2em; position:absolute; bottom:0px; left:0; padding:40px; box-sizing:border-box;background:#fff; transition:0.3s;}
.img_layer .btn_txt_close{position:absolute; top:-40px; right:16px; height:40px; padding:8px 32px; color:#222; font-size:1em; background:#fff; display:block; border-top-left-radius: 2px; border-top-right-radius: 2px;}

.img_layer .txt span{display:block; width:100%; padding:8px;}
.img_layer .txt span:first-of-type{border-bottom:1px solid #888; font-size:1.8em; font-weight:bold; padding-bottom:16px; margin-bottom:8px;}
.img_layer .txt span:nth-of-type(2),.img_layer .txt span:nth-of-type(3){display:inline-block; width:auto;}
.img_layer .txt span:nth-of-type(2)::after{content:''; display:inline-block; width:1px; height:18px; background:#888; margin:5px 8px 0 32px;}

@media screen and (max-width: 768px) { 
   .img_layer .img_pop_wrap>p, .img_layer .img_pop_wrap_a{width:100%; text-align: center;}
   .img_layer .img_pop_wrap>p img, .img_layer .img_pop_wrap_a img{max-width:100%;}
}

/*목록 돌아가기 버튼*/
.btn_back{position: fixed; right:50px; bottom: 135px;  z-index:1000;width: 56px; height: 56px; border-radius: 50px;  border: 2px solid #0172c2; background: #fff; box-shadow: 3px 3px 5px rgba(0,0,0,0.5); text-align: center; transition:0.3s;}
.btn_back:hover{bottom:140px;}
.btn_back a{color:#0172c2; font-size: 0.9em; font-weight: bold; display: block; padding: 12px 0; }
.btn_back i{padding: 0; width: inherit; height: inherit; display: block; background: none; line-height: 1em; margin-right: 0; margin-bottom: 3px;}
.btn_back a:hover{padding: 12px 0; background: none;}
/* .btn_back a{color:#fff; font-size: 1.3em; font-weight: bold; display: block; height: 56px;  border-radius: 50px; padding: 0 0px 0 0;}
.btn_back a:hover{background: #fff;padding: 0 24px 0 0; color:#0172c2;}
.btn_back i{margin-right: 8px; width: 56px; height: 56px; text-align: center;border-radius: 50px; background: #fff; color:#0172c2; line-height: 56px;} */

@media screen and (max-width: 1024px) { 
  .btn_back{right:0;}
   /* .btn_back{left:inherit; left: 0px; bottom: 80px; width: 56px; height: 56px; border-radius: 50px;  border: 2px solid #0172c2; background: #fff; box-shadow: 3px 3px 5px rgba(0,0,0,0.5);}
    .btn_back a{color:#0172c2; font-size: 0.9em; font-weight: bold; display: block; padding: 8px 0; }
    .btn_back i{padding: 0; width: inherit; height: inherit; display: block; background: none; line-height: 1em; margin-right: 0; margin-bottom: 3px;}
    .btn_back a:hover{padding: 8px 0; background: none;} */
    .btn_back, .top{opacity:0;}
    .fix_btn{opacity:1;}
}

/*위로가기 버튼*/
.top{position: fixed; right: 50px; bottom: 80px; width: 56px; height: 56px; background: #0172c2; border-radius: 50px; box-sizing: border-box; color: #fff; font-weight: 600;padding-top: 10px; box-shadow: 3px 3px 5px rgba(0,0,0,0.5); z-index:1000;}
.top::before{content: '\f077';font-family: FontAwesome;font-style: normal;font-weight: normal;text-decoration: inherit; color:#fff; position: absolute; top:10px; left:20px;}

/*footer*/
footer{position: fixed; bottom: 24px; right: 24px; text-align: right;}
footer .copyright{font-size: 0.8em; line-height: 1.3em; color:#fff;}
.subfooter{right:inherit; text-align: center; width:30%; bottom:10px;}
.subfooter p{width:380px; margin:0 auto;}

/* slide */
.month div#popupZoneSlideShow{overflow: hidden; background:#eeeeee; height: 200px;}
.month div#popupZoneSlideShow > a{ display: block; width: 100%; height: 100%; padding:40px; box-sizing:border-box; transition:none;}
.month div#popupZoneSlideShow > a img{ width: 100%; height: 100%;}
.main_c{ overflow: hidden; height: 739px; position: relative; background: #fff; margin-top: 100px;}
.m_vis{ position: absolute; top: 0; left: 0;  width: 48%; height: 739px; background: #999; }
.m_vis .cycle-slideshow{ position: relative; width: 100%; height: 739px; overflow: hidden;}
.m_vis .cycle-slideshow .page{ position: absolute; bottom: 30px; right: 70px; z-index: 1000;}
.m_vis .cycle-slideshow .cycle-pager {position: absolute; bottom: 30px; right: 120px; z-index: 1000;}
.m_vis .cycle-slideshow .cycle-pager strong a { font-size: 0; line-height: 0; width: 15px; height: 20px; display:inline-block; background: url(/images/main/vis_off.png) no-repeat center center;}
.m_vis .cycle-slideshow .cycle-pager strong.cycle-pager-active a{ background: url(/images/main/vis_on.png) no-repeat center center;}
.m_vis .cycle-slideshow .page a.stop{ float: left; display: block; width: 20px; height: 20px; background: url(/images/main/vis_stop.png) no-repeat center center;}
.m_vis .cycle-slideshow .page a.play{ float: left; display: block; width: 20px; height: 20px; background: url(/images/main/vis_play.png) no-repeat center center;}
.m_vis .cycle-slideshow .vis{ display: block; width: 100%; height: 740px; background-size: cover; background-repeat: no-repeat; background-position: center center; position: relative; z-index: 50;}
.m_vis .cycle-slideshow .vis .vis_t_bg{ position: absolute; bottom: 60px; right: 0; width:100%; text-align: right;}
.m_vis .cycle-slideshow .vis .vis_t_bg div{position:absolute; left:-3000%;}
.m_vis .cycle-slideshow .vis .vis_t_bg img{ margin-right: 70px;}
.m_vis .cycle-slideshow .vis .vis_t_bg a{  display: block; padding: 480px 0 20px 0;}
.m_vis .cycle-slideshow .vis_right{background-position: right center;}
.m_vis .cycle-slideshow .b span{ display:inline-block; padding:30px; color:#fff; opacity: 0.5; font-size:40px; cursor: pointer; transition:all 0.5s ease;}
.m_vis .cycle-slideshow .b #prev{ position: absolute; top: 42%; left: 0; z-index: 1000;}
.m_vis .cycle-slideshow .b #next{ position: absolute; top: 42%; right: 0; z-index: 1000;}
.m_vis .cycle-slideshow .b span:hover{ opacity: 10;}
.m_b {position:absolute; bottom:20px; right:10px; z-index:120; color:#222;}
.m_b p:first-of-type{vertical-align: text-top;}
.m_b p{display: inline-block; font-size:0.9em; margin-right:10px; vertical-align: bottom;}
.m_b a{display:inline-block; font-size:0; margin-left:-4px;}


@media screen and (max-width: 1024px) {    
    footer{position: relative; display: block; text-align: center; bottom: inherit; right: inherit; }
    footer p {margin: 24px;}
    .subfooter{bottom: 0; left:0; width: 100%; text-align: center; top:inherit;}
    .subfooter p{width:100%;}
    .top{right:0px; bottom: 80px;}    
}
@media screen and (max-width: 640px) {    
  .month_wrap{padding:24px;}
  .month div#popupZoneSlideShow > a{padding:24px;}
  .month h2{top:32px;}
  .month .month_txt{top:64px;}
}



/* 오늘의 기증자 */
.today_title{width:300px; margin:150px auto 0; color:#fff; font-size:2em;}
.today_title span{font-weight: 300;}
.today_exp{width:300px; margin:24px auto 0; color:#fff; line-height: 1.5em; font-size:1.2em; text-align: justify;}
.today_donor{position: relative;}
.today_donor .btn{position: absolute; right:0; top:20px; background:#fff; color:#0172c2; border:1px solid #0172c2;}
.today_donor .btn i{margin-left:16px;}
.today_donor .btn:hover{color:#fff004; background: #0172c2;}
.today_donor h1{color:#fff; font-size:2em; padding-left: 60px;}
.today_donor h1::before{content: '\f073';font-family: FontAwesome;font-style: normal;font-weight: normal;text-decoration: inherit;color: #fff;opacity: 0.5;font-size: 1.7em;margin-right: -16px;position: absolute;top: 0;left: 0;z-index: -1;}
.today_donor h1 span{font-size:0.6em; display: block; margin-bottom:4px;}
.today_donor .today_donor_view{width:100%; border-radius: 5px; padding:40px; box-sizing:border-box; background: #fff; box-shadow: 3px 3px 5px rgba(0,0,0,0.5); margin:16px 0 40px; font-size:0;}
.today_donor .today_donor_view .today_donor_img{width:40%; max-width: 500px; height:450px; margin-right:40px; position:relative; display: inline-block; vertical-align: top; text-align:center; background: #efefef;}
.today_donor .today_donor_view .today_donor_img::before{content:''; display: inline-block; height: 100%; vertical-align: middle;}
.today_donor .today_donor_view .today_donor_img img{display: inline-block; max-width:100%; max-height:100%; vertical-align: middle;}
.today_donor .today_donor_view .today_donor_txt{display: inline-block; font-size:1rem; width:calc(60% - 40px);}
.today_donor .today_donor_view .today_donor_txt h2.donor_name{font-size:2em; margin-bottom:8px;}
.today_donor .today_donor_view .today_donor_txt .item_num{color:#666; font-size:1.2em;}
.today_donor .today_donor_view .today_donor_txt .item_name{font-size:1.5em; font-weight: bold; display:block; margin-top:40px;}

/* 오늘의 기증자 리스트 */
.today_donor .today_donor_list{margin-bottom:24px;}
.today_donor .today_donor_list .today_item{width:20%; float:left;padding:4px; box-sizing: border-box;}
.today_donor .today_donor_list .today_item a{display:block; border-radius: 5px; background: #fff; width:100%; height:240px; overflow: hidden;}
.today_donor .today_donor_list .today_item .img{width:100%; height:160px; background: #efefef; text-align: center; overflow: hidden;}
.today_donor .today_donor_list .today_item .img::before{content:''; display: inline-block; height: 100%; vertical-align: middle;}
.today_donor .today_donor_list .today_item .img img{display: inline-block; max-width:100%; max-height:100%; vertical-align: middle; transition:all 0.2s ease;}
.today_donor .today_donor_list .today_item a:hover .img img{transform:scale(1.2);}
.today_donor .today_donor_list .today_item .txt{padding:24px; box-sizing: border-box;}
.today_donor .today_donor_list .today_item .today_donor_date{white-space: nowrap;}
.today_donor .today_donor_list .today_item .name{margin-top:4px; font-size:1.3em; display: block; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}

@media screen and (max-width: 1440px) {       
  .today_donor .today_donor_view .today_donor_img{height: 350px;}
  .today_donor .today_donor_view .today_donor_img{width:50%; max-width:50%;}
  .today_donor .today_donor_view .today_donor_txt{width:calc(50% - 40px);}  
  .today_donor .today_donor_list .today_item a{height:200px;}
  .today_donor .today_donor_list .today_item .img{height:120px;}
  .today_donor .today_donor_list .today_item .txt{padding:16px;}
}
@media screen and (max-width: 1024px) {
  .today_title{width:100%;}
  .today_exp{width:100%;}
  .today_donor {margin-top:-100px;}
  .today_donor .today_donor_list .today_item{width:25%;}
  .today_donor .today_donor_list .today_item .txt{padding:16px;}  
}
@media screen and (max-width: 640px) {
  .today_donor .today_donor_list .today_item{width:50%;}
  .today_donor .today_donor_view{padding:24px;}
  .today_donor .today_donor_view .today_donor_img{width:100%; max-width: 100%; margin-bottom:16px;}
  .today_donor .today_donor_view .today_donor_txt{width:100%;}
}
.donor_btn_next{
	padding: 8px 20px 10px;
	background: #0172c2;
	border-radius: 50px;
	color:white;
	margin-bottom: 30px;
}

.donor_btn_input{
	background: #0172C2;
    color: white;
    border-radius: 2px;
    padding: 2px 17px 2px 17px;
    font-weight: normal;
    font-size: 14px;
    
}
.donor_application_bottom {
	margin-bottom: 70px;
    text-align:right;
    float: right;
}
.donor_application_bottom_left {
	margin-bottom: 70px;
    float: left;
}
.donor-privacy{
	background: #F1F1F1 0% 0% no-repeat padding-box;
    border-radius: 5px;
    opacity: 1;
    line-height: 30px;
    padding: 35px;
}

.donor-privacy ul{
	padding-top: 10px;
	padding-bottom: 10px;
}
.donor-privacy ul li{
	padding-left: 10px;
}

.checkbox-wrap, .checkbox .btn-default {
	cursor: pointer;
	margin: 5px;
}

.checkbox-wrap .check-icon {
	cursor: pointer;
	display: inline-block;
	width: 30px;
	height: 29px;
	background: url(/images/ckbox.png) left center no-repeat;
	vertical-align: middle;
	transition-duration: .3s;
}

.checkbox-wrap input[type=radio], .checkbox-wrap input[type=checkbox], .checkbox .btn-default input[type=radio], .checkbox .btn-default input[type=checkbox]{
	display: none;
}

.checkbox-wrap input[type=checkbox]:checked+.check-icon, .checkbox-wrap input[type=radio]:checked+.check-icon {
	background-image: url(/images/ckbox_on.png);
}

.checkbox .btn-default .check-icon {
	display: inline-block;
	width: 80px;
	height: 29px;
	background: url(/images/ckbox2.png) left center no-repeat;
	vertical-align: middle;
	transition-duration: .3s;
	box-sizing: border-box;
}

.checkbox .btn-default input[type=checkbox]:checked+.check-icon, .checkbox .btn-default input[type=radio]:checked+.check-icon {
	background-image: url(/images/ckbox_on2.png);
}

.checkbox .btn-default {
	border: none;
	background: none;
}

input[type="checkbox"]:focus ~ i {
	border: 1px solid #000;
}

.search_wrap .checkbox .btn-default input[type=radio], .search_wrap .checkbox .btn-default input[type=checkbox] {
	display: block;
}
.checkbox_block{
	float: right; 
	margin: 10px;
}


.checkbox_privacy{
	text-align: center;
	float: initial;
	margin-top:30px;
	font-size:18px
}

.form-container {
      display: flex;
      flex-wrap: wrap;
      margin-bottom: 20px;
      font: normal normal bold 18px/26px Noto Sans KR;
}

.input-type {
      border-bottom: 2px solid grey;
      margin-bottom: 10px;
      margin-right: 30px;
}

.input-double {
      width: 50% !important;
}

.input-double-phone {
      width: 60% !important;
}

.input-double-verify {
      width: 40% !important;
}

.input-block-continer{
	margin-left: 184px
}

.input-block-continer-view{
	margin-left: 134px !important;
}

.input-container {
      width: 100%;
      padding-bottom: 10px;
      margin-bottom: 10px;
}

.input-container label {
      font-weight: bold;
      display: inline-block;
      width: 100px;
      margin-bottom: 10px;
}

.input-container input {
      border: none;
      padding: 5px;
      width: calc(100% - 120px);
      flex: 1;
}


.input-container textarea {
      border: none;
      padding: 5px;
      width: calc(100% - 120px);
      flex: 1;
      display: block;
      margin-bottom: 10px;
}

.label-text-area{
	float: left;
}

.input-container .notice {
      color: #d4023e;
      font: normal normal normal 14px/20px Noto Sans KR;
      margin-top: 5px;
}

.donor-notice-checklist {
	color: #d4023e;
	font-weight: bold; 
	text-decoration: underline;
}

.input-cellphone-donor{
	width: calc(100% - 120px - 112px) !important; 
 	display: inline-flex;
}

.btn-cellphone-donor{
	float: right;
	display: inline-flex;
}
.donor-finish{
	color: #666666;
    font-size: 18px;
    font-weight: normal;
}

.donor-checklist-text{
    font-weight: bold;
}
input[type="date"]::-webkit-inner-spin-button,
input[type="date"]::-webkit-calendar-picker-indicator {
    display: none;
    -webkit-appearance: none;
}

input[type="date"]::before {
  content: attr(placeholder);
  position: absolute;
  color: #999999;
}

input[type="date"] {
  color: #ffffff;
}

input[type="date"]:focus,
input[type="date"]:valid {
  color: #666666;
}

input[type="date"]:focus::before,
input[type="date"]:valid::before {
  content: "";
}

.donor-input-view h5{
	float: left !important; 
	height: max-content !important; 
	width: 134px !important;
}
.donor-input-view p{
	font-size: 24px !important; 
	font-weight: bold !important; 
	width: calc(100% - 134px) !important;
}

.donor-padding-bottom{
	padding-top: 30px;
    padding-bottom: 30px;
}

@media screen and (max-width: 1024px) {	
	.input-double {
	      width: 100% !important;
	}
	.input-block-continer{
		margin: 0;
	}
	.input-double-phone {
	      width: 100% !important;
	}
	.input-double-verify {
	      width: 100% !important;
	}
	.input-block-continer-view{
		margin: 0 !important;
	}
	.donor-input-view h5{
		width: auto !important;
	}
	.donor-input-view p{
		width: auto !important;
	}
}